<template>
  <div>
    <a-modal
      v-model:visible="visible"
      :footer="null"
      :title="currentItem.key + '权限列表'"
      :after-close="afterClose"
      @ok="handleOk"
    >
      <a-table :columns="columns" :data-source="data" :pagination="false" :scroll="{ y: 400 }"></a-table>
    </a-modal>
  </div>
</template>
<script setup>
import { ref, defineEmits, reactive, defineExpose, defineProps, toRefs } from 'vue'
import factory from '../../factory'

const visible = ref(false)
const handleOk = (e) => {
  visible.value = false
}
const emit = defineEmits(['afterClose'])
const afterClose = () => {
  emit('afterClose', '')
}
defineExpose({ visible })

//==表格========================
const props = defineProps({
  currentItem: {
    type: Object,
    default: () => {
      return {}
    },
  },
})
let { currentItem } = toRefs(props)
const columns = reactive([
  {
    title: '标识',
    dataIndex: 'key',
  },
  {
    title: '名称',
    dataIndex: 'name',
  },
  {
    title: '表达式',
    dataIndex: 'action',
  },
])
const data = ref([])
const getTable = () => {
  //获得表格数据
  factory.getPermToResources({ resourceRoute: currentItem.value.route }).then((res) => {
    data.value = res.data
  })
}
getTable()
</script>
